﻿var zombies = zombies || {};
var windowURL = window.URL || window.webkitURL;

zombies.HomePage = function () {
    var self = this;

    self.Loaded = ko.observable(true);
    self.SearchString = ko.observable('');

    self.AdvShows = ko.observableArray();

    self.IsVideo = ko.observable(false);
    self.VideoLink = ko.observable();
    self.IsFlash = ko.observable(false);
    self.FlashLink = ko.observable();
    self.IsImage = ko.observable(false);
    self.AdvImages = ko.observableArray();



    self.SearchAdv = function (viewModel, event) { 
        var searchText = viewModel.SearchString();
        self.AdvShows.removeAll();
        $.ajax({
            url: '/api/HomePage/SearchAdvertise',
            type: 'POST',
            data: ko.toJSON({ searchString: searchText }),
            contentType: "application/json",
            dataType: "json"
        }).done(function (list) {
            $.each(list, function (idx, item) {
                self.AdvShows.push(new zombies.AdvShow(item));
            });
        }).error(function () {
            toastr.error('error');
        });
    };

    self.BindAdvertise = function (item) {
        self.AdvImages.removeAll();
        self.VideoLink("");
        self.FlashLink("");
        self.IsFlash(false);
        self.IsImage(false);
        self.IsVideo(false);
        $.ajax({
            url: '/api/HomePage/GetLink/' + item.AdvId,
            type: 'GET',
            contentType: "application/json; charset=utf-8",
            dataType: "json"
        }).done(function (request) {          
            if (request.type == 'Video') {
                self.IsVideo(true);
                self.VideoLink(request.list[0].MediaLink);
            }
            else if (request.type == 'Flash') {
                self.IsFlash(true);
                self.FlashLink(request.list[0].MediaLink);
            }
            else {
                self.IsImage(true);
                $.each(request.list, function (idx, item) {
                    self.AdvImages.push(new zombies.AdvImage(item));
                });
                $('.slidyContainer').slidy({
                    // Options go here, see slidy.js
                    // These the defaults so don't only need to be specified if they are changed

                    throttle: false, // Set to true, and include jQuery throttle plugin (http://benalman.com/projects/jquery-throttle-debounce-plugin/)
                    throttleTime: 500, // number of ms to wait for throttling
                    showArrows: true, // Show arrows for next/prev image
                    movePrev: 'movePrev', // Div id to use for previous button
                    moveNext: 'moveNext', // Div id to use for next button
                    useKeybord: true, // use keys defined below to expand / collapse sections
                    auto: true,       // Start slideshow automatically
                    interval: 4000,     // Time between each slide
                    initialInterval: 6000  // Initial interval when page loads

                });
            }
        }).fail(function (request) {
            self.Loaded(false);
        });
    }
};

ko.bindingHandlers.enterKey = {
    init: function (element, valueAccessor, allBindings, vm) {
        ko.utils.registerEventHandler(element, "keyup", function (event) {
            if (event.keyCode === 13) {
                ko.utils.triggerEvent(element, "change");
                valueAccessor().call(vm, vm); //set "this" to the data and also pass it as first arg, in case function has "this" bound
            }

            return true;
        });
    }
};

zombies.AdvImage = function (item) {
    var self = this;

    self.MediaId = item.MediaId;
    self.MediaLink = '../' + item.MediaLink;
}

zombies.AdvShow = function (item) {
    var self = this;

    self.AdvId = item.AdvId;
    self.Title = item.Title;
    self.HtmlTag = "<img src='../" + item.PreviewImg + "' />";
    self.Link = '../Advertise/' + item.AdvId;
}

var loadAdvertise = function (id) {
    $.ajax({
        url: '/api/HomePage/GetLink/' + id,
        type: 'GET',
        contentType: "application/json; charset=utf-8",
        dataType: "json"
    }).done(function (request) {
        homePageViewModel.AdvImages.removeAll();
        if (request.type == 'Video')
        {
            homePageViewModel.IsVideo(true);
            homePageViewModel.IsFlash(false);
            homePageViewModel.IsImage(false);
            homePageViewModel.VideoLink(request.list[0].MediaLink);
        }
        else if (request.type == 'Flash')
        {
            homePageViewModel.IsVideo(false);
            homePageViewModel.IsFlash(true);
            homePageViewModel.IsImage(false);
            homePageViewModel.FlashLink(request.list[0].MediaLink);
        }
        else if (request.type == 'Images')
        {
            homePageViewModel.IsVideo(false);
            homePageViewModel.IsFlash(false);
            homePageViewModel.IsImage(true);
            $.each(request.list, function (idx, item) {
                homePageViewModel.AdvImages.push(new zombies.AdvImage(item));
            });
            $('.slidyContainer').slidy({
                // Options go here, see slidy.js
                // These the defaults so don't only need to be specified if they are changed

                throttle: false, // Set to true, and include jQuery throttle plugin (http://benalman.com/projects/jquery-throttle-debounce-plugin/)
                throttleTime: 500, // number of ms to wait for throttling
                showArrows: true, // Show arrows for next/prev image
                movePrev: 'movePrev', // Div id to use for previous button
                moveNext: 'moveNext', // Div id to use for next button
                useKeybord: true, // use keys defined below to expand / collapse sections
                auto: true,       // Start slideshow automatically
                interval: 4000,     // Time between each slide
                initialInterval: 6000  // Initial interval when page loads
            });
        }        
    }).fail(function (request) {
        homePageViewModel.Loaded(false);
    });
};

var load = function () {

    homePageViewModel.AdvShows.removeAll();

    $.ajax({
        url: '/api/HomePage/GetTop',
        type: 'GET',
        contentType: "application/json; charset=utf-8",
        dataType: "json"
    }).done(function (items) {
        $.each(items, function (idx, item) {
            homePageViewModel.AdvShows.push(new zombies.AdvShow(item));
        });
        loadAdvertise(homePageViewModel.AdvShows()[0].AdvId);
    }).fail(function (request) {
        homePageViewModel.Loaded(false);
    });
};

var homePageViewModel;
$(document).ready(function () {
    homePageViewModel = new zombies.HomePage();
    load();
    ko.applyBindings(homePageViewModel, document.getElementById("my-container"));
});